<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <span th:include="~{include::cssStyle}"></span>
    <script>
        function upImg(target,e){
            //判断是不是IE浏览器并获取图片大小
            var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
            var fileSize = 0;
            if(isIE && !target.files){
                var filePath = target.value;
                var fileSystem = new ActiveXObject("Scription.FileSystemObject");
                var file = fileSystem.GetFile(filePath);
                fileSize = file.Size;
            }else{
                fileSize = target.files[0].size;
            }
            //验证大小
            if(fileSize>4*1024*1024){
                alert("图片不能超过4M");
                $(target).val('');
                $(target).next().prop('src','');
                return
            }
            //获取图片回显路径
            var objUrl = getObjectURL(target.files[0]);

            //获取img节点
            var element = $(target).next();

            //给img节点src赋值设置固定大小
            element.prop('src', objUrl);
            element.css({"height":"100px"});
        }
        //建立一個可存取到該file的url
        function getObjectURL(file) {
            var url = null;
            if (window.createObjectURL != undefined) { // basic
                url = window.createObjectURL(file);
            } else if (window.URL != undefined) { // mozilla(firefox)
                url = window.URL.createObjectURL(file);
            } else if (window.webkitURL != undefined) { // webkit or chrome
                url = window.webkitURL.createObjectURL(file);
            }
            return url;
        }
    </script>
</head>
<body>
        <div class="container">
           <form method="post" th:action="@{/student/add}"  enctype="multipart/form-data" th:object="${stu}">
                 <input type="hidden" name="id" th:value="*{id}">
                <input type="hidden" name="version" th:value="*{version}">
                <input type="hidden" name="pic" th:value="*{pic}">
                姓名：<input type="text" name="name" th:value="*{name}"><br>
               性别：<input type="radio" name="sex" value="0" th:checked="*{sex==0}">男
                    <input type="radio" name="sex" value="1" th:checked="*{sex==1}">女<br>
               生日：<input type="text" name="birthday" th:value="*{#dates.format(birthday,'yyyy-MM-dd')}"><br>
               头像：<img th:src="@{'/static/upload/' + *{pic}}" width="50px" height="50px">
               <input type="file" name="file"  onchange="upImg(this,event)" /> <img src="" alt=""/>
               <button class="btn btn-success">提交</button>
           </form>
        </div>
</body>
</html>
